import { lazy } from 'react'
import { Navigate } from 'react-router-dom'
const Home = lazy(() => import('../views/home'))
const Search = lazy(() => import('../views/search'))
const My = lazy(() => import('../views/my'))
const Login = lazy(() => import('../views/login'))
const Tag = lazy(() => import('../views/tag'))
const MainLayout = lazy(() => import('../views/mainLayout'))
const Detail = lazy(() => import('../views/detail'))
export const routes = [
  {
    path: '/',
    element: <MainLayout></MainLayout>,
    children: [
      {
        path: '/home',
        element: <Home></Home>,
      },
      {
        path: '/my',
        element: <My></My>,
      },
      {
        path: '/',
        element: <Navigate to="/home"></Navigate>,
      },
    ],
  },
  {
    path: '/search',
    element: <Search></Search>,
  },
  {
    path: '/login',
    element: <Login></Login>,
  },
  {
    path: '/tag',
    element: <Tag></Tag>,
  },
  {
    path: '/detail/:id',
    element: <Detail></Detail>,
  },
]
